<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>个人信息管理</title>
<link rel="styleSheet" href="../../css/bootstrap.min.css">
<style type="text/css">
	#kong{
	width: 178px;
	}
	#updatePIM{
	margin-left:  150px;
	width: 100px;
	}
	#mainDiv{
		width:800px;
		margin-left: 100px;
	}
	 .col-sm-4{
        padding: 0px;
        width: 240px;
       
    }
</style>
</head>
<body>
	<div id="mainDiv">
		<br>
		<br>
		<form action="../../updatePIM.do" method="post" onsubmit="return check()">
			<div class="row">
                <div class="col-xs-6 col-sm-4">
                    <label style="float:right;">工&nbsp;&nbsp;&nbsp;号&nbsp;&nbsp;&nbsp;：</label>
                </div>
                <div class="col-xs-6 col-sm-4">
                    <span style="margin-left:10px;" id="gonghao"></span>
					<label id="kong"></label>
                </div>
            </div>			
			<br>
			<br>
			<div class="row">
                <div class="col-xs-6 col-sm-4">
                    <label style="float:right;">真实姓名：</label>
                </div>
                <div style="margin-left:10px;" class="col-xs-6 col-sm-4">
                   <span id="name"></span>
					<label id="kong"></label>
                </div>
            </div>			
			<br>
			<br>
			<div class="row">
                <div class="col-xs-6 col-sm-4">
                    <label style="float:right;">密&nbsp;&nbsp;&nbsp;码&nbsp;&nbsp;&nbsp;：</label>
                </div>
                <div class="col-xs-6 col-sm-4">
                    <input type="password" style="width:200px;" class="form-control placeholder="密码" onblur="checkPassword()" id="password" name="password">           
                </div>
                <div class="col-xs-6 col-sm-4">
                   	<label id="passwordMessage" class="help-block">支持字母和数字组合</label>
                </div>
            </div>		
			<br>
			<br>
			<div class="row">
                <div class="col-xs-6 col-sm-4">
                   <label style="float:right;" onblur="checkTel()">电话号码：</label>
                </div>
                <div class="col-xs-6 col-sm-4">
                   <input id="operatorTel" style="width:200px" class="form-control" name="operatorTel" type="text"  onblur="checkTel()" placeholder="电话号码"/>          
                </div>
                <div class="col-xs-6 col-sm-4">
                   <label id="operatorTelMessage" class="help-block">请输入有效联系方式</label>
                </div>
            </div>			
			<br>
			<br>
			<div style="margin-left:156px;">
			<label>权&nbsp;&nbsp;&nbsp;限&nbsp;&nbsp;&nbsp;：</label><span id="quanxian"></span>
			<br>
			<br>
			<input style="margin-top:30px;" id="updatePIM" type="submit" class="btn btn-warning" value="修改">
			</div>
		</form>
	</div>
	<script type="text/javascript" src="../../js/jquery-3.1.0.min.js"></script>
	<script type="text/javascript">
	$(function(){
		var id=getParam("id");
		$.ajax({
			   type: "post",
			   url: "../../showPIM.do",
			   data: {id:id},
			   success: function(msg){
				   $("#gonghao").html(msg[0][0]);
				   $("#password").val(msg[0][1])
				   $("#name").html(msg[0][2]);
				   $("#operatorTel").val(msg[0][3])
				   var quanxian="";
				   var checkbox="";
				   for(var i=0;i<msg.length;i++){
					   quanxian=msg[i][4];
					   checkbox+="&nbsp;&nbsp;"+quanxian;
					  }
				   $("#quanxian").html(checkbox);
			   }
			});
	})
	
		function getParam(url){
			 var reg
			 = new RegExp("(^|&)"+
			 url +"=([^&]*)(&|$)");
			 var r
			 = window.location.search.substr(1).match(reg);
			if (r!=null) return unescape(r[2]); return null;
		 }
		function check() {
			var flag = checkPassword() && checkTel();
			return flag;
		}
		function checkPassword(){
			var password = document.getElementById("password").value;
			var passwordMessage = document.getElementById("passwordMessage");
			var eReg =  /^[a-zA-Z][a-zA-Z0-9]{5,19}$/;
			if (password.length == 0) {
				passwordMessage.innerHTML = "密码不能为空";
				return false;
			} else if (!eReg.test(password)) {
				passwordMessage.innerHTML = "密码必须以字母开头，且长度为6-20位";
				return false;
			} else {
				passwordMessage.innerHTML = "写对啦！";
				return true;
			}		
		}
		function checkTel() {
			var operatorTel = document.getElementById("operatorTel").value;
			var operatorTelMessage = document.getElementById("operatorTelMessage");
			var eReg = /^1[34578]\d{9}$/;
			if (operatorTel.length == 0) {
				operatorTelMessage.innerHTML = "电话号码不能为空";
				return false;
			} else if (!eReg.test(operatorTel)) {
				operatorTelMessage.innerHTML = "电话号码格式不正确";
				return false;
			} else {
				operatorTelMessage.innerHTML = "写对啦！";
				return true;
			}
		}
	</script>
</body>
</html>